<template>
    <div class="pc-select-date">
        <el-date-picker
            @change="selectDate"
            v-model="PcValue"
            type="datetimerange"
            :picker-options="pickerOptions"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd H:m:s"
            align="center">
        </el-date-picker>
    </div>
</template>

<script>
    export default {
        name:'PCSelectDate',
        data() 
        {
            return {
                pickerOptions: {
                    shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                    }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                    }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                    }]
                },
                PcValue: ''
            }
        },
        methods: {
            selectDate()
            {
                console.log(this.PcValue);
                this.$parent.callDate(this.PcValue)
            }
        },
    }
</script>